<template>
  <div>
    <div class="app-container">
      <el-form size="mini" ref="postForm" :inline="true" :model="postForm" :label-position="'right'"
               label-width="100px">
        <el-row type="flex" justify="space-between" :gutter="20">
          <el-form-item label="受检单位名称">
            <el-input v-model="postForm.sjcdwmc" placeholder="请输入内容"/>
          </el-form-item>
          <el-form-item label="检测编号">
            <el-input v-model="postForm.jcbh" placeholder="请输入内容"/>
          </el-form-item>
          <el-form-item label="受检单位地址">
            <el-input v-model="postForm.sjcdwdz" placeholder="请输入内容"/>
          </el-form-item>
          <el-form-item label="联系人">
            <el-input v-model="postForm.lxr" placeholder="请输入内容"/>
          </el-form-item>
        </el-row>
        <el-row type="flex" justify="space-between" :gutter="20">
          <el-form-item label="联系电话">
            <el-input v-model="postForm.lxdh" placeholder="请输入内容"/>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" size="mini" @click="query()">查询</el-button>
            <el-button type="warning" size="mini" @click="add()">新增</el-button>
          </el-form-item>
        </el-row>
      </el-form>
      <el-table :height="tableHeight" :data="tableData" stripe border width="100%">
        <el-table-column type="index" align="center" width="50"></el-table-column>
        <el-table-column prop="jclx" label="检测类型" align="center"/>
        <el-table-column prop="jcbh" label="检测编号" align="center"/>
        <el-table-column prop="sjcdwmc" label="受监测单位名称" align="center"/>
        <el-table-column prop="sjcdwdz" label="受监单位地址" align="center"/>
        <el-table-column prop="dwxz" label="单位性质" align="center"/>
        <el-table-column prop="lxr" label="联系人" align="center"/>
        <el-table-column prop="lxdh" label="联系电话" align="center"/>
        <el-table-column fixed="right" label="操作" width="140">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="showInfo(scope.$index,scope.row)">
              查看
            </el-button>
            <el-button type="text" size="small" @click="showReportInfo(scope.$index,scope.row)">
              报告中心
            </el-button>
            <el-button v-if="scope.row.tableNode==1&&scope.row.userId==userId" type="text" size="small"
                       @click="del(scope.$index,scope.row)">删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-row type="flex" class="row-bg" justify="center">
        <el-pagination
          background
          layout="total,prev,pager,next,jumper,sizes"
          :total="total"
          @size-change="handleSizeChange"
          :current-page.sync="currentPage"
          :page-sizes="[15, 30, 45, 60, 75,90,105,120,135,150]"
          :page-size="pageSize"
          @current-change="handleCurrentChange"
        />
      </el-row>
      <el-dialog
        :visible.sync="centerDialogVisible"
        center
        width="96%"
      >
        <tableInfo ref="tableInfo" :no-created="true"/>
      </el-dialog>
      <!--      弹框报告中心-->
      <el-dialog
        title="报告中心"
        :visible.sync="centerReportDialogVisible"
        center
        width="80%">
        <el-row style="text-align: center;">
          <el-col :span="8" style="padding: 10px;" v-if="tableNode>=1">
            <a @click="downloadFile(1)">现场调查记录表</a>
          </el-col>
          <el-col :span="8" style="padding: 10px;" v-if="tableNode>=2">
            <a @click="downloadFile(2)">现场检测方案</a>
          </el-col>
          <el-col :span="8" style="padding: 10px;" v-if="tableNode>=3">
            <a @click="downloadFile(3)">工资日写记录表</a>
          </el-col>
          <el-col :span="8" style="padding: 10px;" v-if="tableNode>=4">
            <a @click="downloadFile(4)">现场采样记录表</a>
          </el-col>
          <el-col :span="8" style="padding: 10px;" v-if="tableNode>=6">
            <a @click="downloadFile(5)">样品交样单</a>
          </el-col>
          <el-col :span="8" style="padding: 10px;" v-if="tableNode>=7">
            <a @click="downloadFile(6)">实验室原始记录表</a>
          </el-col>
          <el-col :span="8" style="padding: 10px;" v-if="tableNode>=8">
            <a @click="downloadFile(7)">实验室分析记录表</a>
          </el-col>
          <el-col :span="8" style="padding: 10px;" v-if="tableNode>=10">
            <a @click="downloadFile(8)">检测报告</a>
          </el-col>
          <el-col :span="8" style="padding: 10px;" v-if="tableNode>=11">
            <a @click="downloadFile(9)">职业病危害因素检测评价报告</a>
          </el-col>
        </el-row>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import tableInfo from '@/views/table/tableInfo'
import {
  page, getInfo, del, xcdcjlb, xcjcfa, gzrxsjlb, cyjlb, ypjid, ysjl, fxjlb,
  jcpcbg,
  jcbg
} from '@/api/table/tableOne'
import fileUpdate from '@/components/Upload/fileUpdate'
import {getUserId} from '@/utils/auth'

export default {
  components: {
    fileUpdate,
    tableInfo
  },
  data() {
    return {
      tableHeight: window.innerHeight - 180,
      qiniuDataObj: {token: ''},
      fileUrl: process.env.VUE_APP__FILE_URL,
      // 总条数
      total: 0,
      // 每页显示个数
      pageSize: 15,
      // 页码
      currentPage: 1,
      // 查询条件
      postForm: {},
      // 查询条件
      selectForm: {},
      tableNode: 1,
      // 列表数据
      tableData: [],
      userId: getUserId(),
      typeList: [],
      // 编辑下标
      editIndex: 0,
      typeIndex: null,
      // 是否展示表单
      centerDialogVisible: false,
      centerReportDialogVisible: false,
      // 表单标题
      title: null,
      // 银行
      rules: {
        rewards: [{required: true, message: '请输入内容', trigger: 'chang'}],
        tagName: [{required: true, message: '请输入内容', trigger: 'chang'}],
        claim: [{required: true, message: '请输入内容', trigger: 'chang'}],
        name: [{required: true, message: '请输入内容', trigger: 'chang'}],
        taskTypeId: [{required: true, message: '你选择内容', trigger: 'chang'}],
        dataJson: [{required: true, message: '请上传文件', trigger: 'chang'}]
      }
    }
  },
  created() {
    this.typeIndex = this.params && this.params.type
    if (!this.noCreated) {
      this.getData()
    }
  },
  methods: {
    downloadFile(type) {
      var fileUrl = "http://139.224.164.30/download/";
      if (type === 1) {
        xcdcjlb(this.formInfo.id).then(response => {
          window.open(fileUrl + response.data, '_blank');
        })
      }
      if (type === 2) {
        xcjcfa(this.formInfo.id).then(response => {
          window.open(fileUrl + response.data, '_blank');
        })
      }
      if (type === 3) {
        gzrxsjlb(this.formInfo.id).then(response => {
          window.open(fileUrl + response.data, '_blank');
        })
      }
      if (type === 4) {
        cyjlb(this.formInfo.id).then(response => {
          window.open(fileUrl + response.data, '_blank');
        })
      }
      if (type === 5) {
        ypjid(this.formInfo.id).then(response => {
          window.open(fileUrl + response.data, '_blank');
        })
      }
      if (type === 6) {
        ysjl(this.formInfo.id).then(response => {
          window.open(fileUrl + response.data, '_blank');
        })
      }
      if (type === 7) {
        fxjlb(this.formInfo.id).then(response => {
          window.open(fileUrl + response.data, '_blank');
        })
      }
      if (type === 8) {
        jcbg(this.formInfo.id).then(response => {
          window.open(fileUrl + response.data, '_blank');
        })
      }
      if (type === 9) {
        jcpcbg(this.formInfo.id).then(response => {
          window.open(fileUrl + response.data, '_blank');
        })
      }

    },
    handleSizeChange(val) {
      this.pageSize = val
    },
    // 初始化
    init(userId) {
      this.postForm = {}
      this.postForm.userId = userId
      this.selectForm = this.postForm
      this.currentPage = 1
      this.getData()
    },
    add() {
      this.centerDialogVisible = true
      this.$nextTick(() => {
        this.$refs.tableInfo.init(null)
      })
    },
    // 分页查询
    handleCurrentChange(val) {
      this.currentPage = val
      this.getData()
    },
    // 查询条件
    query() {
      this.selectForm = this.postForm
      this.currentPage = 1
      this.getData()
    },
    getData() {
      // 请求分页参数
      page(this.pageSize, this.currentPage, this.selectForm.sjcdwmc, this.selectForm.jcbh, this.selectForm.sjcdwdz, this.selectForm.lxr, this.selectForm.lxdh, 0, 3, null).then(response => {
        this.total = parseInt(response.count)
        this.tableData = response.data
      })
    },
    showReportInfo(index, row) {
      this.formInfo = row
      this.tableNode = row.tableNode
      this.centerReportDialogVisible = true
    },
    // 查看
    showInfo(index, row) {
      this.editIndex = index
      this.centerDialogVisible = true
      this.$nextTick(() => {
        this.$refs.tableInfo.init(row.id)
      })
    },
    // 删除
    del(index, row) {
      this.$confirm('是否删除该数据', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        del(row.id).then(response => {
          this.getData()
          this.$notify({
            title: '成功',
            message: '操作成功',
            type: 'success',
            duration: 2000
          })
        })
      })
    }
  }
}
</script>

